<template>
	<view class="house_box">
		<view class="" style="width: 100%; height: 100%;" v-if="recordList.length != 0">
			<scroll-view scroll-y class="fater_view">
				<view :class="['fater_view_item', active == index ? 'active_bc_father': '']"
					v-for="(item, index) of recordList" :key="index" @click="changeActive(index)">
					{{ item.communityName}}
				</view>
			</scroll-view>
			<scroll-view scroll-y class="children_view">
				<view class="" v-for="(itemHouse, indexHouse) of recordList[active].ventricleList" :key="indexHouse">
					<view class="children_view_item_title">
						{{ itemHouse.buildingNumber }}幢{{ itemHouse.unitNumber }}单元{{ itemHouse.ventricleNumber }}室
					</view>
					<view :class="['children_view_item', index == 0 ? 'children_view_item' : '']"
						v-for="(item, index) of itemHouse.list" :key="index" @click="activeIDnavPage(item)">
						<view v-if="item.roomNumber==null || item.roomNumber==''">
							整套出租
						</view>
						{{ item.roomNumber ? item.roomNumber : '' }}房间
					</view>
				</view>


			</scroll-view>
		</view>
		<u-empty v-if="recordList.length == 0" mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png"></u-empty>
	</view>
</template>

<script>
	import {
		getHouseList,
		getListCommunityId
	} from "@/api/home/index.js"

	export default {
		data() {
			return {
				recordList: [],
				active: 0,
			}
		},
		created() {
			this.getHistory()
		},
		methods: {
			activeIDnavPage(item) {
				uni.navigateTo({
					url: '../../inputlease/inputlease?item=' + JSON.stringify(item),
				})
			},
			changeActive(index) {
				this.active = index;
			},
			// async getHistory() {
			// 	const res = await getListCommunityId('', 0)
			// 	if (res.data.code != 200) return uni.showToast({
			// 		title: '获取历史搜索失败',
			// 		icon: 'none'
			// 	})
			// 	this.recordList = res.data.data
			// }
			async getHistory() {
				const res = await getHouseList(0)
				if (res.data.code != 200) return uni.showToast({
					title: '获取历史搜索失败',
					icon: 'none'
				})
				this.recordList = res.data.data
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import "@/styles/global.scss";
	@import "@/styles/index.scss";
	$pageColor: #f58a4c;

	.house_box {
		width: 100%;
		height: 100vh;
		// overflow: hidden;
		box-sizing: border-box;

		.fater_view {
			width: 30%;
			height: 100%;
			float: left;



			.fater_view_item {
				width: 100%;
				height: 100rpx;
				display: flex;
				justify-content: center;
				align-items: center;
				background-color: #f3f4f8;
				font-size: 28rpx;
			}
		}

		.children_view {
			width: 68%;
			height: 100%;
			float: right;

			.children_view_item_title {
				background-color: $pageColor;
				text-align: center;
				width: 100%;
				padding: 40rpx 0;
				font-size: 27rpx;
				color: #fff !important;
			}

			.children_view_item {
				width: 100%;
				height: 100rpx;
				line-height: 100rpx;
				background-color: #f3f4f8;
				font-size: 28rpx;
				padding-left: 10rpx;
				@include textOverflow;
			}
		}
	}

	.active_bc_father {
		background-color:$pageColor !important;
		color: #fff;
		position: relative;
	}

	.active_bc_father::after {
		content: '';
		position: absolute;
		left: 0;
		top: 0;
		height: 100%;
		width: 5%;
	}
</style>